<template>
	<view style="">
		<!-- 顶部标题 -->
		<view class="head_text">
			<text>顾客满意度调查表</text>
			<image src="../../../../static/client/back.png"
				style="width: 20rpx;height: 36rpx;position: absolute;left: 30rpx;top: 63rpx;" @click="back()"></image>
		</view>
		<!-- 项目进度按钮 -->
		<view style="height: 80rpx;background: #f7f7f7;position: relative;">
			<image src="../../../../static/project/jindu.png"
				style="width: 60rpx;height: 60rpx;position: absolute;right: 30rpx;top: 10rpx;"></image>
		</view>
		<form action="">
			<!-- 项目名称 -->
			<view class="info_item">
				<text>项目名称</text>
				<input placeholder="请输入" style="margin-top: 39rpx;" placeholder-style="font-size:30rpx" value="" />
			</view>
			<!-- 委托单位 -->
			<view class="info_item">
				<text>委托单位</text>
				<input placeholder="请输入" style="margin-top: 39rpx;" placeholder-style="font-size:30rpx" value="" />
			</view>
			<!-- 项目负责人 -->
			<view class="info_item">
				<text>项目负责人</text>
				<input placeholder="请输入" style="margin-top: 39rpx;" placeholder-style="font-size:30rpx" value="" />
			</view>
			<!-- 评价人员 -->
			<view class="info_item">
				<text>评价人员</text>
				<input placeholder="请输入" style="margin-top: 39rpx;" placeholder-style="font-size:30rpx" value="" />
			</view>
			<!-- 日期 -->
			<view class="info_item" style="position: relative;">
				<text>日期</text>
				<picker mode="date" @change="setDate1" class="picker1">
					<view>{{date1}}</view>
				</picker>
				<image src="../../../../static/project/date.png" class="date2"></image>
			</view>
			<!-- 对评价工作的满意程度： -->
			<view class="info_item" style="border-bottom: 0;">
				<text>对评价工作的满意程度</text>
				<view class="box" >
					<checkbox-group name="" >
						<label v-for="item in box_list" style="display: flex;align-items: center;">
							<checkbox :value="item.value" style="transform: scale(0.7);"/><text>{{item.info}}</text>
						</label>
					</checkbox-group>
				</view>
			</view>
			<!-- 修改记录 -->
			<view class="info_item" style="border-bottom: 0;">
				<text>评价项目完成后，对本企业的安全技术改进是否有促进作用，具体有哪些作用？</text>
				<textarea class="textera" placeholder="请输入"/>
			</view>
			<!-- 修改记录 -->
			<view class="info_item" style="border-bottom: 0;">
				<text>评价项目完成后，对企业的安全管理是否有促进作用，具体有哪些作用？</text>
				<textarea class="textera" placeholder="请输入"/>
			</view>
			<!-- 修改记录 -->
			<view class="info_item" style="border-bottom: 0;">
				<text>对评价机构和评价师的意见或建议：</text>
				<textarea class="textera" placeholder="请输入"/>
			</view>
			<!-- 签字 -->
			<view class="text2">
				<text @click="startSign1()">修改人（签字）：</text>
				<image :src="s1" mode="" style="width: 200rpx;height: 100rpx;"></image>
			</view>
			<view class="text2" style="margin-top: 0;">
				<text @click="startSign2()">审核负责人（签字）：</text>
				<image :src="s2" mode="" style="width: 200rpx;height: 100rpx;"></image>
			</view>
			<!-- 签字板 -->
			<Signature ref="sig1" style="background: #0066CC;"></Signature>
			<Signature ref="sig2" style="background: #0066CC;"></Signature>
			<view class="riqi">
				<text>日期</text>
				<picker mode="date" @change="setDate2">
					<view class="rq">
					<text>{{date2}}</text>
					<image src="../../../../static/project/date.png" class="date"></image>
					</view>
				</picker>
			</view>
			<!-- 附件上传 -->
			<view class="info_item" style="border: 0;margin-bottom: 200rpx;">
				<view class="" style="display: flex;flex-direction: row; align-items: center;">
					<text>附件上传</text>
					<image src="../../../../static/firm/icon_sc.png" style="width: 25rpx;height: 18rpx;margin-left: 32rpx;">
					</image>
					<text class="uptext">点击上传文件</text>
				</view>

				<view class="" style="display: flex;flex-direction: row; align-items: center;margin-top: 40rpx;">
					<image src="../../../../static/know/PDF.png" style="width: 40rpx;height: 48rpx;"></image>
					<text class="file_name">关于邦泰合力管理咨询有限公司的资料.pdf</text>
				</view>
			</view>
			<!-- 底部按钮 -->
			<view class="bottom">
				<button class="bottom_btn" style="background: #CCCCCC; width: 380rpx;" form-type="reset">保存草稿</button>
				<button class="bottom_btn"
					style="background: linear-gradient(0deg, #037CE3, #2EB3FF); margin-top: -88rpx;margin-left: 50%;"
					form-type="submit">提交</button>
			</view>
		</form>
		<view class="fbtn" @click="fbtnClick()">
			<image src="../../../../static/images/xiangmu1@2x.png"></image>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				s1:'',
				s2:'',
				s3:'',
				date1:'选择时间',
				date2:'选择时间',
				
				box_list:[
					{
						value:1,
						info:'1.评价机构的收费是否合理？'
					},
					{
						value:2,
						info:'2.评价机构是否能按照评价项目合同规定的时间完成评价报告？'
					},
					{
						value:3,
						info:'3.评价机构是否向其他第三方泄露了本企业的技术及商业秘密？'
					},
					{
						value:4,
						info:'4.评价结论是否客观？'
					},
					{
						value:5,
						info:'5.评价机构人员的专业技术水平如何？'
					},
					{
						value:6,
						info:'6.评价机构从业人员的工作作风和敬业精神如何？'
					},
					{
						value:7,
						info:'7.对评价机构技术服务质量的总体评价如何？'
					}
				]
				
			}
		},
		methods: {
			// 设置时间
			setDate1(e){
				this.date1 = e.detail.value
			},
			// 设置时间
			setDate2(e){
				this.date2 = e.detail.value
			},
			// 点击右下文件按钮
			fbtnClick() {
				console.log('22')
			},
			/* 
			点击返回 
			 */
			back() {
				uni.navigateBack({
					delta: 1
				})
			}
		}
	}
</script>

<style lang="scss">
	.box{
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #666666;
	}
	.riqi{
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-left: 310rpx;
		.rq{
			width: 250rpx;
			height: 60rpx;
			border: 1rpx solid #DFDFDF;
			border-radius: 10rpx;
			font-size: 26rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #666666;
			display: flex;
			flex-direction: row;
			align-items: center;
			margin-left: 50rpx;
			padding-left: 21rpx;
			
		}
	}
	.picker1 {
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #999999;
		margin-top: 42rpx;
	}
	.textera{
		width: 690rpx;
		height: 225rpx;
		background: #F7F7F7;
		margin-top: 30rpx;
	}
	.date {
		width: 32rpx;
		height: 32rpx;
		margin-left: 60rpx;
	}
	.date2 {
		width: 32rpx;
		height: 32rpx;
		position: absolute;
		right: 51rpx;
		top: 90rpx;
	}
	.text2{
		font-size: 25rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
		margin-top: 40rpx;
		margin-left: 310rpx;
		display: flex;
		flex-direction: row;
	}
	.text1{
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #128BF1;
		margin-top: 21rpx;
	}

	.fbtn {
		position: fixed;
		left: 592rpx;
		bottom: 120rpx;
		z-index: 5;

		image {
			width: 134rpx;
			height: 134rpx;
		}
	}

	.file_name {
		font-size: 26rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #999999;
		margin-left: 19rpx;
	}

	.uptext {
		font-size: 20rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #128BF1;
		margin-left: 10rpx;
	}

	.bottom {
		width: 100%;
		height: 88rpx;
		z-index: 100;
		position: fixed;
		bottom: 0;
	}

	.bottom_btn {
		width: 375rpx;
		height: 88rpx;
		margin-left: 0;
		border-radius: 0;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
	}


	.info_item {
		width: 690rpx;
		height: auto;
		border-bottom: 1rpx solid #E3E3E3;
		margin-left: 30rpx;
		margin-top: 44rpx;
	}

	.head_text {
		width: 100%;
		height: 128rpx;
		font-size: 36rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #333333;
		line-height: 160rpx;
		text-align: center;
	}
</style>
